/**
 * Dear programmer:
 * When I wrote this code, only god and I knew how it worked.
 * Now, only god knows it!
 *
 * @author: Pegasus  Date: 2018-12-15 Time: 23:16
 *
 * 新建服务工单
 */

import React, {Component} from 'react';
import {
    SafeAreaView,
    View,
    Text,
    TouchableOpacity,
    ScrollView,
    TextInput,
    Image, ToastAndroid, Modal
} from 'react-native';
import {connect} from 'react-redux';
import {styles} from './chooseRoomStateScreen.Style';
import {
    COLOR_GRAY_LINE,
    COLOR_FOCUS, COLOR_WHITE, FONT_COLOR_SUB_TITLE,
    FONT_COLOR_TITLE, FONT_SIZE_TITLE
} from "../../../../constant/PHColors"
import AntDesign from "react-native-vector-icons/AntDesign";
import FontAwesome from "react-native-vector-icons/FontAwesome";
import Entypo from "react-native-vector-icons/Entypo";
import DividingLineViewComponent from "../../../../component/DividingLineViewComponent/DividingLineViewComponent";

class chooseRoomStateScreen extends Component {

    static navigationOptions = ({navigation}) => ({
        title: '客房状态',
        headerRight: (
            <TouchableOpacity activeOpacity={0.9} onPress={navigation.getParam('submitClick')}>
                <View style={{ height: 44,paddingRight:15, flexDirection: 'row', justifyContent: 'flex-end', alignItems: 'center'}}>
                    <Text style={{fontSize: 18, color: '#212121'}}>
                        完成
                    </Text>
                </View>
            </TouchableOpacity>
        )
    })

    // 构造
    constructor(props) {
        super(props);

        // 初始状态
        this.state = {
            roomState:this.props.navigation.getParam("roomState"),
        };
    }

    componentWillMount() {
        this.props.navigation.setParams({submitClick: this._submitClick});
    }

    render(){
        return (
            <SafeAreaView style={styles.body}>
                <ScrollView style={styles.body}>
                    {
                        this.props.ondictcode.map((item, index) => {
                            if(item.mname==='客房状态'&&item.level!=='1'){
                                let menu = "false";
                                if (item.level==='2') {
                                    menu = "true"
                                }
                                let check = "false";
                                if(this.state.roomState[item.code]){
                                    check = 'true'
                                }

                                return (
                                    /*客房状态*/
                                    this.onRenderroomStateList(item, index, menu, check)
                                );
                            }

                        })
                    }

                </ScrollView>

            </SafeAreaView>
        )
    }

    onRenderroomStateList=(item, index, menu, check)=>{
        let outHtml;
        if(menu==='true'){
            outHtml = (
                <View key={index} style={styles.cellMenuView}>
                    <Text style={styles.cellMenuText}>
                        {item.name}
                    </Text>
                </View>
            )
        }else if(menu==='false'){
            outHtml = (
                <TouchableOpacity activeOpacity={1} key={index} style={styles.boxBody} onPress={() => {
                    let roomState_json = this.state.roomState;
                    if(roomState_json[item.code]){
                        delete roomState_json[item.code];
                    }else{
                        roomState_json[item.code] = item.name;
                    }
                    this.setState({
                        roomState : roomState_json
                    })
                }}>
                    <View style={styles.leftBox} >
                        {
                            (check === 'true')
                                ?
                                (<AntDesign name={'checkcircle'} size={23} style={{color: COLOR_FOCUS, marginLeft: 10}}/>)
                                :
                                (<Entypo name={'circle'} size={23} style={{color: '#b3b9ba', marginLeft: 10}}/>)
                        }
                        <Text style={styles.leftText}>
                            {item.name}
                        </Text>
                    </View>
                </TouchableOpacity>
            )
        }
        return outHtml
    };

    _submitClick=()=>{
        let {dispatch} = this.props;
        let str = this.state.roomState
        this.props.navigation.navigate(this.props.navigation.getParam("page"));
        this.props.navigation.state.params.goBack(str);
    }

}

const props = state => {
    return {
        ondictcode:state.onCache.dictcode
    }
}

export default chooseRoomStateScreen = connect(props)(chooseRoomStateScreen);
